<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./css/_reset.css" />
    <link rel="stylesheet" href="./css/find.css" />
  </head>
  <body>
    <!-- 整个大盒子 -->
    <div class="all">
      <!-- 顶部 -->
      <div class="top">
        <div class="back">
          <p>Back</p>
        </div>
        <div class="find"><p>发现</p></div>
        <div class="city">
          <div><p>广州市</p></div>
          <div class="city_img">
            <img src="./发现页和详细页/城市切换下拉.png" alt="" />
          </div>
        </div>
      </div>
      <!-- 搜索框 -->
      <div class="search">
        <p>请输入商品名称</p>
        <div class="search_img">
          <img src="./发现页和详细页/搜索矩.png" alt="" />
        </div>
      </div>
      <!-- 大家都在搜 -->
      <div class="popular">
        <p>大家都在搜</p>
        <div class="activity">
          <div class="activity_top">
            <span>寿司</span>
            <span>羽毛球</span>
            <span>火锅</span>
            <span>游泳馆</span>
          </div>
          <div class="activity_bottom">
            <span>电影</span>
            <span>周黑鸭</span>
            <span>ktv</span>
            <span>肯德基</span>
          </div>
        </div>
      </div>
      <!-- 热门搜索 -->
      <div class="hot">
        <div class="hot_top">
          <div class="top-left">
            <div><img src="./发现页和详细页/形状22.png" alt="" /></div>
            <p>热门搜索</p>
          </div>
          <div class="top-right">
            <p>更多</p>
            <div><img src="./发现页和详细页/形状4副本.png" alt="" /></div>
          </div>
        </div>
        <!-- 热门搜索内容 -->
        <div class="hot_content">
          <div class="left_img">
            <img src="./发现页和详细页/图层1.png" alt="" />
          </div>
          <div class="right_img">
            <div class="right-top_img">
              <img src="./发现页和详细页/图层2.png" alt="" />
            </div>
            <div class="right-bottom_img">
              <div><img src="./发现页和详细页/图层3.png" alt="" /></div>
              <div><img src="./发现页和详细页/图层4.png" alt="" /></div>
            </div>
          </div>
        </div>
      </div>
      <!-- 推荐搜索 -->
      <div class="recommend">
        <div class="recommend_top">
          <div class="top-left">
            <div><img src="./发现页和详细页/形状12.png" alt="" /></div>
            <p>推荐搜索</p>
          </div>
          <div class="top-right">
            <p>更多</p>
            <div><img src="./发现页和详细页/形状4副本.png" alt="" /></div>
          </div>
        </div>
        <!-- 推荐搜索内容 -->
        <div class="recommend_content">
          <div><img src="./发现页和详细页/图层5.png" alt="" /></div>
          <div><img src="./发现页和详细页/图层6.png" alt="" /></div>
          <div><img src="./发现页和详细页/图层7.png" alt="" /></div>
        </div>
      </div>
      <!-- 底部 -->
      <div class="bottom">
        <div class="bottom_img">
          <div>
            <a href="./index.html"
              ><img src="./发现页和详细页/首页.png" alt="" />
              <p>首页</p>
            </a>
          </div>
          <div>
            <a href="./classification.html"
              ><img src="./发现页和详细页/分类4.png" alt="" />
              <p>分类</p>
            </a>
          </div>
          <div>
            <a
              ><img src="./发现页和详细页/000.png" alt="" />
              <p>发现</p>
            </a>
          </div>
          <div>
            <a href="./mine.html"
              ><img src="./发现页和详细页/我的.png" alt="" />
              <p>我的</p>
            </a>
          </div>
        </div>
      </div>
      <!-- 空的div -->
      <div class="empty"></div>
    </div>
  </body>
</html>
